<!DOCTYPE html>
<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>测试结果</title>
    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.js">
    // <script>
    </script>

    <style>
        
        *{
            margin: 0px;
            padding:0px;
        }
        #box{
            position: relative;
        }
        #box div{
            position: absolute;
                top: 224px;
				left: 294px;
        }
        #1{
            z-index: 1;
        }
        #2{
            z-index: 2;

        }
        #3{
            z-index: 3;
        }
        #box div img{
            width: 1340px;
            height: 580px;
        }
        #num{
            z-index:5 ;
            margin-top: 170px;
            margin-left: 480px;
        }
        span{
            font-size: 150px;
			FONT-FAMILY:"仿宋";
        }
		body{
		background-image: url(../static/images/end1.jpg);
            overflow-x: hidden;
			position: relative;
			height: 600px;
			background-repeat: no-repeat;
			background-color: #008081;
        } 
		#div5{
			    position: absolute;
				left: 1389px;
				top: 522px;
		}
		#img2{
			height:100px;
            height: 100px;
            position: absolute;
            top: 100px;
            left: -204px;
		}
        #jing{
            FONT-FAMILY: "仿宋";
            position: absolute;
            font-size: 50px;
            left: 410px;
            top: 300px;
        }
        #tim{
            FONT-FAMILY: "仿宋";
            position: absolute;
            font-size: 50px;
            left: 410px;
            top: 610px;
        }
        #hisForm{
            position: absolute;
            /*right: 30px;*/
            top: 405px;
            /*width: auto;*/
            position: absolute;
            left: 1480px;
            width: 600px;
            font-size: 30px;
            font-family: "仿宋";
        }
        #detail{
            position: absolute;
            /*right: 30px;*/
            top: 370px;
            /*width: auto;*/
            position: absolute;
            left: 1475px;
            width: 600px;
            font-size: 30px;
            font-family: "仿宋";
        }
        .label6{
            display: inline-block;
            width: 180px;
            text-align: left;
        }
        .label7{
            display: inline-block;
            width: 110px;
            text-align: left;
        }
        .label8{
            display: inline-block;
            width: 150px;
            text-align: left;
        }
    </style>

</head>
<body>
    <div id="words_num" >

    </div>
    <div id="box" >
        <span id="jing"></span>
        <div id="num">
            <span id = "hua"></span>
        </div>
        <span id="tim"></span>
    </div>
    <div id="div5">
            <img id="img2" src="../static/images/page4.2.2.png" onclick="window.location.href ='first'">
        </div>
    <div>
<!--        <button id="history" left="510px" top="500px" onclick="getHistory()">点击获取历史成绩:</button>-->
        <div id="detail"></div>
        <div id="hisForm">

        </div>
    </div>

</body>
<script>

    // var url = document.location.toString();
    // var urlParmStr = url.slice(url.indexOf('=')+1);//获取问号后所有的字符串
    //var data = parseInt(urlParmStr.slice(5));
    window.onload=function (){
        getHistory();
    }
    var username = sessionStorage.getItem("username");
    var result=sessionStorage.getItem("result");
    var t=sessionStorage.getItem("time");


    document.getElementById("jing").innerHTML  = username+"，您的词汇量是：";
	document.getElementById("hua").innerHTML  = result;
	document.getElementById("tim").innerHTML = "用时："+t;


    function getHistory() {
        // sessionStorage.removeItem("time");
        $.ajax({
            url: 'history?username='+sessionStorage.getItem("username"),
            type: 'get',
            data: JSON.stringify(sessionStorage.getItem("username")),

            success: function (his) {
                var str1= "<div>"
                    +"<label class='label6'>日期</label>"
                    +"<label class='label7'>词汇量</label>"
                    +"<label class='label8'>用时</label>"
                    +"</div>";
                var str = "";
                for (var i = 0; i < his.length ;i++)
                {
                    str += "<div>"
                        +"<label class='label6'>"+his[i].date+"</label>"
                        +"<label class='label7'>"+his[i].score+"</label>"
                        +"<label class='label8'>"+his[i].time+"</label>"
                        +"</div>";
                }
                document.getElementById("detail").innerHTML=str1;
                document.getElementById("hisForm").innerHTML=str;
            },
            error: function () {
                alert('服务器超时，请重试！');
            }
        })
        }

    
        
       
</script>
</html>